<template>
   <div class="companyDetailed">
     <!--  <h2>公司详细信息页 </h2> -->
      <div class="contentWrap">
        <el-form ref="updateCompanyInfo" :model="updateCompanyForm" status-icon :rules="rules" label-width="120px" label-position="right" >
           <el-form-item label="公司logo：" style="width:100%;float:none">
              <singleUpload v-if="reqState" :params="uploadLogo" :uploadSuccess="logoSuccess" :pictureUrl="updateCompanyForm.cpyLogo" :width="130" :height="130" ></singleUpload>
            </el-form-item>

          <div class="companyInput_group clear">
           <el-form-item label="公司名称："  class="layout-half" prop="companyname">
             <el-input type="text" v-model="updateCompanyForm.companyname" auto-complete="off"></el-input>
           </el-form-item>
           <el-form-item label="手机号："  class="layout-half" prop="ctUsermobile">
              <el-tooltip placement="top">
                  <div slot="content">手机号暂时无法修改</div>
                  <el-input type="number" :disabled="!!(updateCompanyForm.ctUsermobile)" v-model="updateCompanyForm.ctUsermobile" auto-complete="off"></el-input>
              </el-tooltip>
           </el-form-item>
          </div>
          <div class="companyInput_group clear">
           <el-form-item label="公司电话："  class="layout-half">
             <el-input type="number" v-model="updateCompanyForm.cpyTel" auto-complete="off"></el-input>
           </el-form-item>
           <el-form-item label="公司法人：" class="layout-half">
             <el-input v-model="updateCompanyForm.cpyMgruser"></el-input>
           </el-form-item>
          </div>
          <div class="companyInput_group clear">
           <el-form-item label="法人电话：" class="layout-half">
             <el-input v-model="updateCompanyForm.cpyMgrmobile"></el-input>
           </el-form-item>
           <el-form-item label="公司性质：" class="layout-half">
             <el-select v-model="updateCompanyForm.cpyNature" clearable placeholder="请选择" style="display:block">
              <el-option v-for="item in NatureOptions" :key="item.value" :label="item.label" :value="item.value"></el-option>
            </el-select>
           </el-form-item>
           </div>
          <div class="companyInput_group clear">
              <el-form-item label="省县区域：" class="layout-half">
                <el-cascader clearable :options="CityInfo" change-on-select v-model="cityData" style="display:block"></el-cascader>
              </el-form-item>
               <el-form-item label="通讯地址：" class="layout-half">
                 <el-input v-model="updateCompanyForm.comaddress"></el-input>
               </el-form-item>
          </div>
          <div class="companyInput_group clear">
             <el-form-item label="详细地址：" class="layout-half">
               <el-input v-model="updateCompanyForm.dtladdress"></el-input>
             </el-form-item>
             <el-form-item label="公司证件号：" class="layout-half">
               <el-input v-model="updateCompanyForm.cpyDutyno"></el-input>
             </el-form-item>
          </div>
           <el-form-item label="成立日期：" class="layout-half">
             <el-date-picker style="width:100%"
               v-model="updateCompanyForm.cpyDate" type="date" value-format="yyyy-MM-dd HH:mm:ss" :picker-options="pickerOptions">
             </el-date-picker>
           </el-form-item>
           <el-form-item label="排序值："  class="priority">
             <el-input type="number" v-model="updateCompanyForm.orderindex" auto-complete="off"></el-input>
           </el-form-item>
           <el-form-item label="附件信息" class="cpyRemark">
              <imgUpload v-if="isShow" :params="uploadData" :picList="uploadData.picList" :uploadSuccess="accessoryUploadSuccess" :uploadRemove="uploadRemove"></imgUpload>
           </el-form-item>
           <el-form-item label="公司简介" class="cpyRemark">
             <el-input type="textarea" :rows="7" v-model="updateCompanyForm.cpyRemark"></el-input>
           </el-form-item>
         </el-form>
         <div slot="footer" class="dialog-footer">
           <el-button v-on:click="$router.push('/set/companys/')">返回</el-button>
           <el-button type="primary" v-on:click="submitForm">保存</el-button>
         </div>

      </div>

    </div>
</template>

<script>
import {getProvincial} from '../../../common/js/provincial'
import imgUpload       from '@/components/img-upload/imgUpload'
import singleUpload    from '@/components/img-upload/singleUpload'
import {IMGSERVER}     from '@/common/js/constant'
export default {
  data(){
    return {
      uploadData:{
        name:"cpmparyLogoFile",
        picList:[]
      },
      uploadLogo:{
        name:"cpmparyLogoFile"
      },
      updateCompanyForm: {
        cityname:[],
        cpyDate:'',
        cpyNature:''
        // companyid:this.$route.params.id,       //公司id
      },
      cityData:[],
      CityInfo:getProvincial(),
      pickerOptions:{
          //設置選擇時間不可大於以後的時間
          disabledDate(time) {
           return time.getTime() > Date.now();
          }
        },
      NatureOptions: [{
          value: '国有企业',
          label: '国有企业'
         },{
          value: '集体企业',
          label: '集体企业'
        }, {
          value: '私营企业',
          label: '私营企业'
        },{
          value: '股份有限公司',
          label: '股份有限公司'
      }],
      reqState:false,
      rules:{
        companyname:[
            { required: true, message: '公司名称不能为空', trigger: 'blur' }
        ],
        ctUsermobile:[
            { required: true, message: '请输入手机号', trigger: 'blur' }
        ]
      },
      isShow:false
    }
  },
  mounted (){
    this.$post('/company/getCompanyinfo',{companyid: this.$route.params.id},(data)=>{
      //把字符串转成没有带引号的数组
      //1.城市选择
      let cityname_Array = data.cityname.split(",");
      cityname_Array = JSON.parse('[' + String(cityname_Array) + ']');
      this.cityData      = cityname_Array;

      // 2.证件
      if(data.cpyUpfiles !=''){
        let picArray = data.cpyUpfiles.split(",");
        for(let key in picArray){
          let obj = {
            // url:IMGSERVER+picArray[key]
             url:picArray[key]
          }
          this.uploadData.picList.push(obj);
          
        }
      }
      this.isShow = true;
      this.updateCompanyForm.companyname    = data.companyname;
      this.updateCompanyForm.cpyRemark      = data.cpyRemark;
      this.updateCompanyForm.ctUsermobile   = data.ctUsermobile;
      this.updateCompanyForm.comaddress     = data.comaddress;
      this.updateCompanyForm.dtladdress     = data.dtladdress;
      this.updateCompanyForm.cpyMgruser     = data.cpyMgruser;
      this.updateCompanyForm.cpyDutyno      = data.cpyDutyno;
      this.updateCompanyForm.cpyDate        = data.cpyDate;
      this.updateCompanyForm.cpyNature      = data.cpyNature;
      this.updateCompanyForm.orderindex     = data.orderindex;
      this.updateCompanyForm.cpyLogo        = data.cpyLogo;
      this.updateCompanyForm.cpyUpfiles     = data.cpyUpfiles;
      this.updateCompanyForm.companyid      = data.companyid;
      this.updateCompanyForm.cpyTel         = data.cpyTel;
      this.updateCompanyForm.cpyMgrmobile  =data.cpyMgrmobile;
      this.reqState = true;
    },(err)=>{
      alert(err)
    })
  },
  methods: {
    uploadRemove(val){
      this.updateCompanyForm.cpyUpfiles = val.join(',');
      console.log( this.updateCompanyForm.cpyUpfiles );
      // alert("删除功能正在完善中，请稍后再试"+val);

    },
    submitForm(){
      this.$refs['updateCompanyInfo'].validate((valid) => {
        if(valid){
            //硬是要把数组转成字符串
          this.updateCompanyForm.cityname = this.cityData.toString();
          console.log(this.updateCompanyForm);
          this.$post('/company/updateCompany',this.updateCompanyForm,(data)=>{
                 this.$message({
                   type: 'success',
                   message: '保存成功!',
                   // callback: this.getCompany()
                 })
             },(err)=>{
                alert(err)
             })
        }else{
          this.$message.error("必填项不能为空");
        }
      });
    },
    logoSuccess(val){
      this.updateCompanyForm.cpyLogo = val;
    },
    accessoryUploadSuccess(val){
      // 转字符串
      this.updateCompanyForm.cpyUpfiles = val.join(',');
    }
  },
  components:{
    imgUpload,
    singleUpload
  }
}
</script>

<style scoped lang="scss">
  @import "./company.scss";
</style>
